<template>
	<view class="user_person">
		<uni-list :border="false">
			<uni-list-item clickable title="头像" :showArrow="true" @click="choseImg">
				<template slot="footer">
					<image class="slot-image" :src="params.avatar" ></image>
				</template>
			</uni-list-item>
			<uni-list-item clickable title="昵称" :showArrow="true" :rightText="params.nickname" @click="open"></uni-list-item>
		</uni-list>
		
		<!-- <view class="log-out-btn" @click="logout">保存</view> -->
		
		<uni-popup ref="popup" type="dialog">
		    <uni-popup-dialog style="text-align: center;" type="info" mode="input" title="提示" :value="params.nickname" placeholder="请输入昵称" @confirm="dialogInputConfirm" />
		</uni-popup>
	</view>
</template>

<script>
	import uniPopupDialog from '@/components/uni-popup/uni-popup-dialog.vue'
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	export default {
		components: {
			uniPopup,
			uniPopupDialog
		},
		data() {
			return {
				params:{
					nickname:'神秘人~',
					avatar:'',
				}
			};
		},
		onLoad() {
			this.checkLogin();
		},
		methods:{
		
			open(){
				this.$refs.popup.open();
			},
			dialogInputConfirm(done, val){
				if(val == ''){
					return this.$toast('请不要为空');
				}
				let obj2 = {...this.$api.users}
				obj2.url = obj2.url+'/edit_user'
				obj2.method = 'put'
				this.$http(obj2,{nickname:val}).then(res=>{
					this.checkLogin();
					done()
					this.$toast(res.msg);
				})
			},
			checkLogin(){
				this.$http(this.$api.checkLogin).then(res=>{
					if(res.code == 200){
						uni.$emit('users')
						this.params.nickname = res.data.nickname
						this.params.avatar = res.data.avatar
					}
				})
			},
			choseImg(){
				uni.chooseImage({
					count:1,
					success: (e) => {
						uni.showLoading()
						let obj = {...this.$api.users}
						obj.url = obj.url+'/avatar_upload'
						uni.uploadFile({
							url:obj.url,
							fileType:'image',
							filePath:e.tempFilePaths[0],
							name:'file',
							formData:{
								token:uni.getStorageSync('token')
							},
							success: (item) => {
								let info = JSON.parse(item.data)
								let obj2 = {...this.$api.users}
								obj2.url = obj2.url+'/edit_user'
								obj2.method = 'put'
								this.$http(obj2,{avatar:info.data}).then(res=>{
									this.checkLogin();
									this.$toast(res.msg);
								})
							},
							complete: () => {
								uni.hideLoading()
							}
						})
						
						
						
						// console.log(JSON.stringify(e.tempFilePaths[0]));
						
					}
				})
			}
		}
	}
</script>

<style lang="scss">
.user_person{
	margin-top: 10rpx;
	.log-out-btn{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 690upx;
		height: 80upx;
		margin: 60upx auto;
		color: #fff;
		background-color: #ea1f22;
		border-radius: 10upx;
		box-shadow: 1px 2px 5px rgba(219, 40, 43, 0.4);	
	}
	.slot-image{
		width: 60rpx;
		height: 60rpx;
		border-radius: 8rpx;
		background-color: #efefef;
	}
}
</style>
